<!doctype html>
<html>

	<head>
		<meta charset="utf-8">
		<title></title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<link rel="stylesheet" href="../css/mui.min.css">
		<link rel="stylesheet" href="../css/common.css" />
	</head>
		<style type="text/css">
			body {
				overflow: hidden;
				padding: 90px 40px;
			}
			.close {
				position: absolute;
				left: 15px;
				top: 15px;
				width: 34px;
				height: 34px;
				padding: 10px;
			}
			ul {
				padding: 0;
			}
			li {
				margin-bottom: 40px;
			}
			li:last-child {
				margin-bottom: 75px;
			}
			li h4{
				font-size: 12px;
				font-weight: 900;
			}
			li span {
				font-size: 14px;
			}
			li img {
				width: 16px;
				height: 16px;
				vertical-align: middle;
				margin-left: 5px;
			}
			li input[type=text] {
				box-shadow:0 0 0 60px #eee inset;
				-webkit-text-fill-color: #878787;
				border: 0;
				outline:none;
				padding: 0;
				color: #333;
				font-size: 16px;
				border-bottom: 0.5px solid #333;
			}
			.submit {
				display: inline-block;
				width: 150px;
				height: 40px;
				line-height: 40px;
				color: #fff;
				background: #EA7575;
				border-radius: 30px;
				text-align: center;
				font-size: 14px;
				position: relative;
				left: 50%;
				margin-left: -75px;
			}
			.tip {
				margin-top: 15px;
				text-align: center;
			}
		</style>
	<body>
		<img class="close" src="../img/close.png" >
		<ul>
			<li>
				<h4>HOTEL</h4>
				<p><span>酒店名称</span><img src="../img/hotel-name.png" ></p>
				<input type="text" placeholder="请输入酒店名称" />
			</li>
			<li>
				<h4>NAME</h4>
				<p><span>联系人姓名</span><img src="../img/user-name.png" ></p>
				<input type="text" placeholder="请输入联系人姓名" />
			</li>
			<li>
				<h4>PHONE</h4>
				<p><span>联系人电话</span><img src="../img/phone.png" style="width: 12px;" ></p>
				<input type="text" placeholder="请输入联系人电话" />
			</li>
			<li>
				<h4>PROMITER</h4>
				<p><span>推荐人</span><img src="../img/user-name.png" ></p>
				<input type="text" placeholder="请输入推荐人" />
			</li>
		</ul>
		<div class="submit">提交</div>
		<p class="tip">提交后我们会尽快与您取得联系</p>
		
		<script type="text/javascript" src="../js/config.js" ></script>
		<script type="text/javascript" src="../js/mui.min.js" ></script>
		<script type="text/javascript" src="../js/jquery-2.1.0.js" ></script>
		<script type="text/javascript" src="../js/mobile-detect.min.js" ></script>
		<script type="text/javascript" src="../js/common.js" ></script>
		<script type="text/javascript">
			mui.init();
			// 点击关闭按钮
			mui('body').on('tap', '.close', function() {         
				mui.openWindow("./login.html", "login.html", {});
			});
			
			// 点击提交按钮
			mui('body').on('tap', '.submit', function() {     
				if ($("input").eq(0).val() == '') {
					mui.alert('请输入酒店名称','','关闭',function (e) {},'div');
					return false;
				} else if ($("input").eq(1).val() == '') {
					mui.alert('请输入联系人姓名','','关闭',function (e) {},'div');
					return false;
				} else if ($("input").eq(2).val() == '') {
					mui.alert('请输入联系人电话','','关闭',function (e) {},'div');
					return false;
				}
				require(weburl + infoCollect, "json", "post", {
					hotel: $("input").eq(0).val(),
					name: $("input").eq(1).val(),
					phone: $("input").eq(2).val(),
					port: 'mobile',
					promoter: $("input").eq(3).val()
				}, function(response) {
					console.log(response);
					plus.nativeUI.closeWaiting();
					if(response.status == "success") {
						mui.alert('提交成功，即将跳转至登录页面','','关闭',function (e) {
						   mui.openWindow("./login.html", "login.html", {});
						},'div');
					} else {
						mui.alert('网络异常，请稍候再试','','关闭',function (e) {},'div');
					}
				}, function(xhr) {
					plus.nativeUI.closeWaiting();
					mui.alert('网络异常，请稍候再试','','关闭',function (e) {},'div');
				})
			});
			
		</script>
	</body>

</html>
